home *** CD-ROM | disk | FTP | other *** search
/ Dynamic HTML Construction Kit / Dynamic HTML Construction Kit.iso / source_code / dhtmlunl / dhtml.exe / CD Content / Chap25 / dun25_5.txt < prev    next >
Encoding:
Text File  |  1997-12-18  |  2.4 KB  |  81 lines

  1. //
  2.  
  3. // zoomer.js
  4.  
  5. // A Portable Canvas Mode Image Zoomer
  6.  
  7. //
  8.  
  9.  
  10.  
  11. // True if we're using Navigator 4.0
  12.  
  13. Nav40 = (document.layers) ? 1 : 0;
  14.  
  15.  
  16.  
  17. // True if a zoomed window is open
  18.  
  19. cmWinOpen = false;
  20.  
  21.  
  22.  
  23. // Capture Click events
  24.  
  25. if (Nav40) {
  26.  
  27.  document.captureEvents(Event.MOUSEDOWN);
  28.  
  29.  document.onmousedown = clicker;
  30.  
  31. }
  32.  
  33.  
  34.  
  35. function clicker(e) {
  36.  
  37.  // If an image is already showing, close the window
  38.  
  39.  if (cmWinOpen) {
  40.  
  41.   cmClose();
  42.  
  43.   return false;
  44.  
  45.  }
  46.  
  47.  
  48.  
  49.  // If the user clicked on a hyperlink that was one of our images,
  50.  
  51.  // open the image
  52.  
  53.  imURL = e.target.toString();
  54.  
  55.  imExt = imURL.substring(imURL.lastIndexOf(".") + 1, imURL.length);
  56.  
  57.  isImage = ( imExt == "gif" || imExt == "jpg" );
  58.  
  59.  if (isImage) {
  60.  
  61.   cmOpen(e)
  62.  
  63.   return false;
  64.  
  65.  }
  66.  
  67.  
  68.  
  69.  return true;
  70.  
  71. }
  72.  
  73.  
  74.  
  75. // A function that opens the canvas mode window
  76.  
  77. function cmOpen(e) {
  78.  
  79.  // Enable universal write target
  80.  
  81.  netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
  82.  
  83.  
  84.  
  85.  // Set window features for Canvas Mode
  86.  
  87.  cmWinProps="titlebar=no,alwaysRaised=yes,dependent=yes
  88.  
  89.  cmWinProps+=",hotkeys=no,resizable=yes";
  90.  
  91.  
  92.  
  93.  // Put the window off-screen until it's resized
  94.  
  95.  cmWinProps+=",screenX=" + screen.width + ",screenY=" + screen.height;
  96.  
  97.  
  98.  
  99.  // Open the window
  100.  
  101.  cmWindow=window.open("","",cmWinProps);
  102.  
  103.  
  104.  
  105.  // Write the document to the new window
  106.  
  107.  cmWindow.document.write('<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 
  108. Transitional//EN"><HTML><HEAD><TITLE>Image</TITLE><STYLE TYPE="text/css">#divIm { position: 
  109. absolute; top: 0; left: 0 }</STYLE><BODY><DIV ID="divIm"><IMG SRC="' + e.target + '"></DIV>');
  110.  
  111.  cmWindow.document.close;
  112.  
  113.  
  114.  
  115.  // Get the width and height of the image and resize the window
  116.  
  117.  imWidth=cmWindow.document.divIm.document.images[0].width;
  118.  
  119.  imHeight=cmWindow.document.divIm.document.images[0].height;
  120.  
  121.  cmWindow.innerWidth=imWidth-4;
  122.  
  123.  cmWindow.innerHeight=imHeight-4;
  124.  
  125.  
  126.  
  127.  // Now move it into view, centered on the mouse pointer
  128.  
  129.  cmWindow.moveTo(e.screenX - (imWidth / 2) , e.screenY - (imHeight / 2));
  130.  
  131.  
  132.  
  133.  // Capture all mousedown events in it, so that a click will close it.
  134.  
  135.  cmWindow.enableExternalCapture;
  136.  
  137.  cmWindow.captureEvents(Event.MOUSEDOWN);
  138.  
  139.  cmWindow.onmousedown=cmClose ;
  140.  
  141.  
  142.  
  143.  // Update cmWinOpen so that we know an image is being displayed
  144.  
  145.  cmWinOpen = true;
  146.  
  147. }
  148.  
  149. // A function that simply closes the canvas mode window
  150.  
  151. function cmClose() {
  152.  
  153.  cmWindow.close();
  154.  
  155.  cmWinOpen = false;
  156.  
  157. }
  158.  
  159.